<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <!--引入本地的css样式-->
  <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../../static/css/admin.css" media="all">
</head>
<body>
<div class="layui-fluid">
  <div class="layui-card">
    <!--搜索框-->
    <div class="layui-form layui-card-header layuiadmin-card-header-auto">
      <div class="layui-form-item">
        <div class="layui-input-inline" style="width: 250px">
          <label class="layui-form-label">客户姓名</label>
          <div class="layui-input-block">
            <input type="text" name="customer_name" id="customer_name" placeholder="" autocomplete="off" class="layui-input">
          </div>
        </div>
        <div class="layui-input-inline">
          <button class="layui-btn layuiadmin-btn-admin" id="btn_search" lay-submit lay-filter="LAY-satisfaction-back-search">
            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
          </button>
        </div>
      </div>
    </div>


    <div class="layui-card-body">
      <!--头部工具栏 id="toolbarDemo" lay-event="事件名"-->
      <script type="text/html" id="toolbarDemo">
        <div class="layui-btn-container">
          <!-- lay-event 给元素绑定事件名 -->
          <button class="layui-btn layuiadmin-btn-admin" lay-event="add">
            添加
          </button>
          <button class="layui-btn layuiadmin-btn-admin" lay-event="update">
            修改
          </button>
          <button class="layui-btn layuiadmin-btn-admin" lay-event="del">
            删除
          </button>
          <button class="layui-btn layuiadmin-btn-admin" lay-event="show">
            查看
          </button>
        </div>
      </script>

      <!--数据表格-->
      <table class="layui-hide" id="LAY-satisfaction-back-manage" lay-filter="LAY-satisfaction-back-manage"></table>

<!--      <script type="text/html" id="sexTpl">-->
<!--        {{#  if(d.sex == 1){ }}-->
<!--        <span>男</span>-->
<!--        {{#  } else if(d.sex == 2){ }}-->
<!--        <span>女</span>-->
<!--        {{#  } }}-->
<!--      </script>-->
      <!-- laytpl模板引擎 数据库状态字段
      1转换成正常显示到页面；2转换成冻结显示到页面 3转换成删除显示到页面 -->
      <!--      <script type="text/html" id="statusTpl">-->
      <!--        {{#  if(d.status == 1){ }}-->
      <!--        <span>启用</span>-->
      <!--        {{#  } else if(d.status == 2){ }}-->
      <!--        <span>禁用</span>-->
      <!--        {{#  } else if(d.status == 3){ }}-->
      <!--        <span>流失</span>-->
      <!--        {{#  } }}-->
      <!--      </script>-->


      <!--            <script type="text/html" id="buttonTpl">-->
      <!--                {{#  if(d.check == true){ }}-->
      <!--                <button class="layui-btn layui-btn-xs">已审核</button>-->
      <!--                {{#  } else { }}-->
      <!--                <button class="layui-btn layui-btn-primary layui-btn-xs">未审核</button>-->
      <!--                {{#  } }}-->
      <!--            </script>-->

      <!--            <script type="text/html" id="table-useradmin-admin">-->
      <!--                <a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>-->
      <!--                {{#  if(d.role == '超级管理员'){ }}-->
      <!--                <a class="layui-btn  layui-btn-xs"><i class="layui-icon layui-icon-delete"></i>删除</a>-->
      <!--                {{#  } else { }}-->
      <!--                <a class="layui-btn  layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>-->
      <!--                {{#  } }}-->
      <!--            </script>-->

      <!--侧边工具栏 id=barDemo lay-event="事件名"-->
      <!--      <script type="text/html" id="barDemo">-->
      <!--        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>-->
      <!--        <a class="layui-btn layui-btn-xs" lay-event="show">查看</a>-->
      <!--        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>-->
      <!--      </script>-->
    </div>
  </div>
</div>

<script src="../../static/js/jquery-3.6.0.min.js"></script>
<!--引入本地layui.js-->
<script src="../../static/layui/layui.js"></script>
<!--js-->
<script type="text/javascript">
    layui.config({
        base: '../../static/layui/layuiadmin/' //静态资源所在路径js
    }).extend({
        index: 'lib/index' //主入口模块
    }).use('index');
</script>

<script type="text/javascript">
    layui.use(['table','form','layer'],function (){
        var table = layui.table;
        var form = layui.form;
        var layer = layui.layer;
        //表格方法渲染：把数据查询显示在数据表格中
        table.render({
            elem:'#LAY-satisfaction-back-manage',//绑定在哪一个table表中,#id值
            url:'/customer_satisfaction/customer_satisfaction',//绑定servlet路径
            title:'客户满意度表',//标题
            toolbar:'#toolbarDemo',//头部工具栏
            cols:[[
                //设置单选框列
                {type:'checkbox',fixed:'left'},
                //设置表头
                {field:'id',title:'ID',fixed:'left',unresize:true,sort:true,width:80},
                {field:'customer_name',title:'客户姓名'},
                // {field:'sex',title:'性别',templet:'#sexTpl'},
                {field:'type',title:'客户类型'},
                {field:'ask_time',title:'调查时间'},
                {field:'quality_satisfaction',title:'质量满意度'},
                {field:'service_satisfaction',title:'服务满意度'},
                {field:'cost_satisfaction',title:'性价比满意度'},
                {field:'total_satisfaction',title:'总体满意度'},

                //侧边工具栏/行工具
                // {title:'操作',fixed:'right',toolbar:'#barDemo',width:180}
            ]],
            page:true,
            limits:[5,10,15,20]
        })

        //按条件搜索,绑定单击事件
        $("#btn_search").click(function (){
            //获取输入框的客户名
            var customer_name = $("#customer_name").val();
            //表格重载
            table.reload('LAY-satisfaction-back-manage', {
                url:'/customer_satisfaction/search',
                page: {
                    curr: 1 //重新从第 1 页开始
                }
                ,where: {
                    customer_name:customer_name
                }
            });
        })

        //监听行工具事件/侧边工具栏
        // table.on('tool(LAY-satisfaction-back-manage)',function (obj){
        //     var data = obj.data;//选中的当前行数据
        //     //获取事件名，根据不同的事件名做出不同的处理
        //     if(obj.event === 'del'){//删除功能
        //         layer.confirm('您确定要删除吗?',function (index){
        //             //发起Ajax请求
        //             $.ajax({
        //                 url:"/customer/del",
        //                 type: "post",
        //                 data:{id:data.id},
        //                 dataType:"json",
        //                 success:function (res){
        //                     layer.alert(res.msg);//弹出提示信息
        //                     obj.del();//页面真删
        //                     layer.close(index);//关闭弹出层
        //                 }
        //             })
        //         })
        //     }else if(obj.event === 'edit'){//编辑功能
        //         layer.open({
        //             type:2,//iframe层
        //             title:'编辑客户资源',
        //             content:'edit.html',//展示编辑页面
        //             area:['700px','550px'],
        //             maxmin:true,
        //             btn:['确定','取消'],
        //             yes:function (index, layero){
        //                 //应该把edit.html页面表单的数据提交给服务器
        //                 //在当前页面-list.html获取iframe层-edit.html的DOM-form表单
        //                 var body = layer.getChildFrame('body', index);
        //                 //获取edit.html页面中所有表单的数据
        //                 var submitData = body.find("#myform").serialize();//serialize()只能序列化表单中文本
        //                 //发起Ajax请求
        //                 $.ajax({
        //                     url:"/customer/update",
        //                     type:"post",
        //                     data:submitData,
        //                     dataType: "json",
        //                     success:function (res){
        //                         if(res.code==200){
        //                             layer.msg(res.msg,{
        //                                 offset:'15px',
        //                                 icon:1,
        //                                 time:1000
        //                             },function (){
        //                                 //刷新
        //                                 window.location.reload();
        //                             })
        //                         }
        //                         if(res.code==500){
        //                             layer.msg(res.msg,{
        //                                 offset:'15px',
        //                                 icon:1,
        //                                 time:1000
        //                             },function (){
        //                                 //刷新
        //                                 window.location.reload();
        //                             })
        //                         }
        //                         layer.close(index);//关闭弹层
        //                     }
        //                 })
        //             },
        //             success: function(layero, index){//子页面edit.html页面数据回显
        //                 var body = layer.getChildFrame('body', index);
        //                 var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
        //                 //input控件的输入框/隐藏框
        //                 body.find("input[name=id]").val(data.id);
        //                 body.find("input[name=customer_code]").val(data.customer_code);
        //                 body.find("input[name=sale_admin]").val(data.sale_admin);
        //                 body.find("input[name=entry_time]").val(data.entry_time);
        //                 body.find("input[name=customer_name]").val(data.customer_name);
        //                 body.find("input[value="+data.sex+"]").attr("checked","checked")
        //                 body.find("input[name=birth]").val(data.birth);
        //                 //select下拉框
        //                 body.find("option[value="+data.type+"]").attr("selected",true)
        //                 //select下拉框
        //                 body.find("option[value="+data.status+"]").attr("selected",true)
        //                 body.find("input[name=mobile_phone]").val(data.mobile_phone);
        //                 body.find("input[name=office_phone]").val(data.office_phone);
        //                 body.find("input[name=email]").val(data.email);
        //                 body.find("input[name=home_phone]").val(data.home_phone);
        //                 body.find("textarea[name=address]").val(data.address);
        //                 body.find("textarea[name=remark]").val(data.remark);
        //                 //刷新渲染  重要！！！！
        //                 iframeWin.layui.form.render();
        //             }
        //         })
        //     }else if(obj.event === 'show'){
        //         layer.open({
        //             type:2,//iframe层
        //             title:'查看客户资源',
        //             content:'edit.html',//展示编辑页面
        //             area:['700px','550px'],
        //             maxmin:true,
        //             success: function(layero, index){//子页面show.html页面数据回显
        //                 var body = layer.getChildFrame('body', index);
        //                 var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
        //                 //input控件的输入框/隐藏框
        //                 body.find("input[name=id]").val(data.id);
        //                 body.find("input[name=customer_code]").val(data.customer_code);
        //                 body.find("input[name=sale_admin]").val(data.sale_admin);
        //                 body.find("input[name=entry_time]").val(data.entry_time);
        //                 body.find("input[name=customer_name]").val(data.customer_name);
        //                 body.find("input[value="+data.sex+"]").attr("checked","checked")
        //                 body.find("input[name=birth]").val(data.birth);
        //                 //select下拉框
        //                 body.find("option[value="+data.type+"]").attr("selected",true)
        //                 //select下拉框
        //                 body.find("option[value="+data.status+"]").attr("selected",true)
        //                 body.find("input[name=mobile_phone]").val(data.mobile_phone);
        //                 body.find("input[name=office_phone]").val(data.office_phone);
        //                 body.find("input[name=email]").val(data.email);
        //                 body.find("input[name=home_phone]").val(data.home_phone);
        //                 body.find("textarea[name=address]").val(data.address);
        //                 body.find("textarea[name=remark]").val(data.remark);
        //                 //刷新渲染  重要！！！！
        //                 iframeWin.layui.form.render();
        //             }
        //         })
        //     }
        // })

        // 监听头部工具栏
        table.on('toolbar(LAY-satisfaction-back-manage)',function (obj){
            // console.log(obj);
            // console.log(obj.config);
            var checkStatus = table.checkStatus(obj.config.id);
            // var customer_name;
            var data = checkStatus.data;
            // console.log(checkStatus);
            // console.log(obj.event);
            switch (obj.event){
                case 'add':
                    layer.open({
                        type:2,//iframe层
                        title:'添加客户满意度信息',
                        content:'add.html',//展示添加页面
                        area:['700px','550px'],
                        maxmin:true,
                        btn:['确定','取消'],
                        yes:function (index, layero){
                            //应该把edit.html页面表单的数据提交给服务器
                            //在当前页面-list.html获取iframe层-edit.html的DOM-form表单
                            var body = layer.getChildFrame('body', index);
                            //获取edit.html页面中所有表单的数据
                            var submitData = body.find("#myform").serialize();//serialize()只能序列化表单中文本
                            //发起Ajax请求
                            $.ajax({
                                url:"/customer_satisfaction/add",
                                type:"post",
                                data:submitData,
                                dataType: "json",
                                success:function (res){
                                    if(res.code==200){
                                        layer.msg(res.msg,{
                                            offset:'15px',
                                            icon:1,
                                            time:1000
                                        },function (){
                                            //刷新
                                            window.location.reload();
                                        })
                                    }
                                    if(res.code==500){
                                        layer.msg(res.msg,{
                                            offset:'15px',
                                            icon:1,
                                            time:1000
                                        },function (){
                                            //刷新
                                            window.location.reload();
                                        })
                                    }
                                    layer.close(index);//关闭弹层
                                }
                            })
                            window.location.reload();
                        }
                    })
                    break;
                    // var data = checkStatus.data;
                    // $.each(data,function (index,item){
                    //     console.log(item)
                    //     customer_name = item.customer_name;
                    //     // console.log(customer_name);
                    // })
                    // if(data.length<1){
                    //     layer.msg('您还未选中数据')
                    // }else{
                    //     sessionStorage.setItem("customer_name", customer_name);
                    //     window.location.href = "showOrder.html";
                    // }
                case 'update':
                    if(data.length<1){
                        layer.msg('您还未选中数据')
                    } else if(data.length>1){
                        layer.msg('只能选中一条数据')
                    } else {
                        layer.open({
                            type: 2,//iframe层
                            title: '编辑客户资源',
                            content: 'edit.html',//展示编辑页面
                            area: ['700px', '550px'],
                            maxmin: true,
                            btn: ['确定', '取消'],
                            yes: function (index, layero) {
                                //应该把edit.html页面表单的数据提交给服务器
                                //在当前页面-list.html获取iframe层-edit.html的DOM-form表单
                                var body = layer.getChildFrame('body', index);
                                //获取edit.html页面中所有表单的数据
                                var submitData = body.find("#myform").serialize();//serialize()只能序列化表单中文本
                                //发起Ajax请求
                                $.ajax({
                                    url: "/customer_satisfaction/edit",
                                    type: "post",
                                    data: submitData,
                                    dataType: "json",
                                    success: function (res) {
                                        if (res.code == 200) {
                                            layer.msg(res.msg, {
                                                offset: '15px',
                                                icon: 1,
                                                time: 1000
                                            }, function () {
                                                //刷新
                                                window.location.reload();
                                            })
                                        }
                                        if (res.code == 500) {
                                            layer.msg(res.msg, {
                                                offset: '15px',
                                                icon: 1,
                                                time: 1000
                                            }, function () {
                                                //刷新
                                                window.location.reload();
                                            })
                                        }
                                        layer.close(index);//关闭弹层
                                    }
                                })
                            },
                            success: function (layero, index) {//子页面edit.html页面数据回显
                                console.log(data);
                                // console.log(data[0].id)
                                // console.log(data[0].customer_code);
                                // console.log(data[0].customer_name);
                                // console.log(data[0].sex);
                                // console.log(data[0].type);
                                // console.log(data[0].status);
                                var body = layer.getChildFrame('body', index);
                                var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                                //input控件的输入框/隐藏框
                                body.find("input[name=id]").val(data[0].id);
                                body.find("input[name=customer_code]").val(data[0].customer_code);
                                body.find("input[name=customer_name]").val(data[0].customer_name);
                                if(data[0].sex==1){
                                    body.find("input[name=sex]").val("男");
                                }else if(data[0].sex==2){
                                    body.find("input[name=sex]").val("女");
                                }
                                body.find("input[name=type]").val(data[0].type);
                                if(data[0].status==1){
                                    body.find("input[name=status]").val("正常")
                                }else if(data[0].status==2){
                                    body.find("input[name=status]").val("冻结")
                                }
                                body.find("input[name=consume_times]").val(data[0].consume_times);
                                body.find("input[name=quality_satisfaction]").val(data[0].quality_satisfaction);
                                body.find("input[name=service_satisfaction]").val(data[0].service_satisfaction);
                                body.find("input[name=cost_satisfaction]").val(data[0].cost_satisfaction);
                                body.find("input[name=total_satisfaction]").val(data[0].total_satisfaction);
                                body.find("textarea[name=customer_feedback]").val(data[0].customer_feedback);
                                //刷新渲染  重要！！！！
                                iframeWin.layui.form.render();
                            }
                        })
                    }
                    break;
                case 'del':
                    if(data.length<1){
                        layer.msg('您还未选中删除的数据')
                    }else{
                        //删除：提示确认框，发起Ajax请求
                        layer.confirm('确定要删除选中行数据吗?',function (index){
                            var ids = new Array();
                            $.each(data,function (index,item){
                                //循环遍历选中的数据，只要数据的id，把id塞入到数组中
                                ids.push(item.id);
                            })
                            //发起Ajax请求
                            $.ajax({
                                url:"/customer/batchdel",
                                type:"post",
                                data:{ids:ids},
                                traditional: true,//数组进行传统的序列化操作
                                dataType:"json",
                                success:function (res){
                                    layer.msg(res.msg,{
                                        offset:'15px',
                                        icon:1,
                                        time:1500
                                    },function (){
                                        //刷新
                                        window.location.reload();
                                    })
                                }
                            })
                        })
                    }
                    break;
                case 'show':
                    if(data.length<1){
                        layer.msg('您还未选中数据')
                    } else if(data.length>1){
                        layer.msg('只能选中一条数据')
                    } else{
                        layer.open({
                            type:2,//iframe层
                            title:'查看客户资源',
                            content:'show.html',//展示编辑页面
                            area:['700px','550px'],
                            maxmin:true,
                            success: function(layero, index){//子页面show.html页面数据回显
                                var body = layer.getChildFrame('body', index);
                                var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                                //input控件的输入框/隐藏框
                                body.find("input[name=id]").val(data[0].id);
                                body.find("input[name=customer_code]").val(data[0].customer_code);
                                body.find("input[name=customer_name]").val(data[0].customer_name);
                                if(data[0].sex==1){
                                    body.find("input[name=sex]").val("男");
                                }else if(data[0].sex==2){
                                    body.find("input[name=sex]").val("女");
                                }
                                body.find("input[name=type]").val(data[0].type);
                                if(data[0].status==1){
                                    body.find("input[name=status]").val("正常")
                                }else if(data[0].status==2){
                                    body.find("input[name=status]").val("冻结")
                                }
                                body.find("input[name=consume_times]").val(data[0].consume_times);
                                body.find("input[name=quality_satisfaction]").val(data[0].quality_satisfaction);
                                body.find("input[name=service_satisfaction]").val(data[0].service_satisfaction);
                                body.find("input[name=cost_satisfaction]").val(data[0].cost_satisfaction);
                                body.find("input[name=total_satisfaction]").val(data[0].total_satisfaction);
                                body.find("textarea[name=customer_feedback]").val(data[0].customer_feedback);
                                //刷新渲染  重要！！！！
                                iframeWin.layui.form.render();
                            }
                        })
                    }
                    break;
            }
        })
    })
</script>
</body>
</html>